<template>
  <div class="table">
    <div class="crumbs">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item><i class="el-icon-tickets"></i> 机构管理</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="container">
      <div class="handle-box" v-if="isAdmin != undefined && isAdmin != null && isAdmin == 1">

        <el-button type="primary" icon="add" class="handle-del mr10" @click="add()" >添加(正式的都只有注册功能)</el-button>
        <el-input v-model="select_word" placeholder="根据名称模糊搜索" class="handle-input mr10"></el-input>
        <el-button type="primary" icon="search" @click="search">搜索</el-button>
      </div>
      <el-table :data="data" border style="width: 100%" ref="tableData" @selection-change="handleSelectionChange">
          <!--<el-table-column type="selection" width="55"></el-table-column>-->
          <el-input type="hidden" prop="id" sortable/>
          <el-table-column prop="name" label="机构名称" sortable width="150">
          </el-table-column>
          <el-table-column prop="code" label="编号">
          </el-table-column>

          <el-table-column label="操作" width="280">
            <template slot-scope="scope">
              <el-button size="small" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
              <el-button size="small" type="danger"  v-if="isAdmin != undefined && isAdmin != null && isAdmin == 1" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination">
          <el-pagination @current-change="handleCurrentChange" layout="prev, pager, next" :total="total" >
          </el-pagination>
        </div>
    </div>



    <!-- 删除提示框 -->
    <el-dialog title="提示" :visible.sync="delVisible" width="300px" center>
      <div class="del-dialog-cnt">删除机构，是否确定删除？</div>
      <span slot="footer" class="dialog-footer">
                <el-button @click="delVisible = false">取 消</el-button>
                <el-button type="primary" @click="deleteRow()">确 定</el-button>
            </span>
    </el-dialog>
  </div>
</template>

<script>

  export default {
    data() {
      return {
        url: './static/vuetable.json',
        tableData: [],
        cur_page: 1,
        total:1,
        multipleSelection: [],
        select_cate: '',
        select_word: '',
        del_list: [],
        is_search: false,
        editVisible: false,
        delVisible: false,
        form: {
          id: '',
          name: '',
          code: '',
        },
        idx: -1

      }
    },
    created() {
      this.getData();
    },
    computed: {
      data() {
        return this.tableData.filter((d) => {
          let is_del = false;
          for (let i = 0; i < this.del_list.length; i++) {
            if (d.name === this.del_list[i].name) {
              is_del = true;
              break;
            }
          }
          if (!is_del) {
            return d;
          }
        })
      }
    },
    methods: {
      // 分页导航
      handleCurrentChange(val) {
        this.cur_page = val;
        this.getData();
      },
      add(){
        this.$router.push({path:'/mechanism/add'})
      },

      queryByName(){
        this.tableData =[];
        this.total =0;
        var that = this;
        this.HttpUtil.encryptGet(
          this,
          this.Global.URLPATH.MECHANISM_QUERY,
          {
            token:sessionStorage.getItem("token"),
            pageNum:that.cur_page,
            name:this.select_word
          },
          function (data) {
            data = data.data;
            that.total = data.total;
            that.tableData = data.list;
          },
          function (data) {//访问失败
            that.tableData = [];
            that.total = 1;
            that.$message.success(data.msg);
          });
      },
      // 获取 easy-mock 的模拟数据
      getData() {
        const userMap = JSON.parse(sessionStorage.getItem("userMap"));
        this.isAdmin = userMap.isAdmin;
        var that = this;
        this.HttpUtil.encryptGet(
          this,
          this.Global.URLPATH.MECHANISM_QUERY,
          {
            token:sessionStorage.getItem("token"),
            type : 1,
            pageNum:that.cur_page
          },
          function (data) {  
            data = data.data;
        
            that.total = data.total;
            that.tableData = data.list
          },
          function (data) {//访问失败
            //that.$message.success(data.msg);
          });
      },
      search() {
        this.is_search = true;
        this.cur_page = 1;
        this.queryByName();

      },
      formatter(row, column) {
        return row.address;
      },
      filterTag(value, row) {
        return row.tag === value;
      },
      handleUser(index, row) {
        const item = this.tableData[index];

        sessionStorage.setItem(this.Global.SESSION_CONFIG.DEPT_USER_THIS,item.id);
        sessionStorage.setItem(this.Global.SESSION_CONFIG.DEPT_NAME_USER_THIS,item.deptName);
        this.$router.push({path:'/user'})
      },
      handleEdit(index, row) {
        const item = this.tableData[index];
        let json = {
          id:item.id,
          name: item.name,
          code:item.code,
        }

        sessionStorage.setItem("mechanism_form",JSON.stringify(json));

        this.$router.push({path:'/mechanism/update',params:{isValues:1}})
        // this.idx = index;
        // const item = this.tableData[index];
        // this.form = {
        //   name: item.name,
        //   date: item.date,
        //   address: item.address
        // }
        // this.editVisible = true;
      },
      handleDelete(index, row) {
        this.idx = index;
        this.delVisible = true;
        const item = this.tableData[index];
        this.form.id = item.id;
      },
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      // 确定删除
      deleteRow(){
        let that = this;
        //发送请求
        this.HttpUtil.encryptDelete(
          this,
          this.Global.URLPATH.MECHANISM_ADD+this.form.id,
          {
                token:sessionStorage.getItem("token"),
          },
          function (data) {
            that.delVisible = false;
            that.getData();
            that.$message.success("删除成功:");
          },function (data) {console.log(data);
            that.$message.success("删除失败:"+data.msg);
          });

      }
    },
    watch:{
      $route(newValue, oldValue){
        if(newValue.path == "/mechanism/index"){
          this.getData();
        }
      }
    }
  }

</script>

<style scoped>
  .handle-box {
    margin-bottom: 20px;
  }

  .handle-select {
    width: 120px;
  }

  .handle-input {
    width: 300px;
    display: inline-block;
  }
  .del-dialog-cnt{
    font-size: 16px;
    text-align: center
  }
</style>
